<template>
<view class="head">
	<view class="fix-wrap" :style="'background: '+bgColor">
		<view class="status-bar"> </view>
		<view class="content">
			<view class="header">
				<navigator open-type="navigateBack" delta="1" hover-class="none" class="t-btn back-btn iconfont f-s50">&#xe63b;</navigator>
				<view class="title">首页</view>	
				<view class="t-btn msg-btn iconfont f-s46">&#xe692;<view class="splot"></view></view>
				<view class="t-btn menu-btn iconfont f-s60" @click="isMenuShow=!isMenuShow">&#xe62c;</view>
				<view class="menu-wrap" v-if="isMenuShow">
					<view class="icon-corrow iconfont">&#xe621;</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/ysb_logo.png" mode="widthFix"></image></view>
						<view class="text">云上报</view>
					</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/yfk_logo.png" mode="widthFix"></image></view>
						<view class="text">云防控</view>
					</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/logo.png" mode="widthFix"></image></view>
						<view class="text">专业项目</view>
					</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/ypx_logo.png" mode="widthFix"></image></view>
						<view class="text">云培训</view>
					</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/logo.png" mode="widthFix"></image></view>
						<view class="text">云监测</view>
					</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/logo.png" mode="widthFix"></image></view>
						<view class="text">药剂溯源</view>
					</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/ydc_logo.png" mode="widthFix"></image></view>
						<view class="text">云调查</view>
					</view>
					<view class="item">
						<view class="icon"><image src="@/static/images/pai_logo.png" mode="widthFix"></image></view>
						<view class="text">云调查</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</view>
</template>

<script>
	import {getSystemInfo} from '@/common/promise.js'
export default{
	name:'demo',
	data(){
		return{
			menuButtonInfo:{},
			title:'页面内容',
			isMenuShow:false
		}
	},
	props:{
		bgColor:{
			type:String
		}
	},
	async onReady () { 
		this.menuButtonInfo = await getSystemInfo();  
	},
	onLoad() {
		
	},
	methods:{
		
	},
	computed:{
		
	},
	components:{
		
	}
}
</script>

<style lang="less">

.status-bar{
	height: 24px;
	width:100%;  
}
.bg-main{
	.fix-wrap{
		// background:radial-gradient(circle at left top, #04a760 10%, #1db774, #38c789);
		// background:radial-gradient(circle at left bottom, #0099ff 0, #3eaef8, #9dd4f9);
	}
}
.bg-white {
	.fix-wrap{
		background:#fff;
	} 
}
.head{ 
	height: 68px;
	.fix-wrap{
		left: 0;
		top: 0;
		width:100%;	
		height: 68px; 
	}
	.content{ 
		height: 44px; 
		z-index:100;  
	}
}
</style>
